<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>06_计算器练习</title>
</head>
<body>
<input type="text" class="i1" placeholder="请输入数字1"><br>
<input type="text" class="i2" placeholder="请输入数字2"><br>
<button onclick="calculate('+')">加</button>
<button onclick="calculate('-')">减</button>
<button onclick="calculate('*')">乘</button>
<button onclick="calculate('/')">除</button>
<br>
<h2>运算结果: <span class="result"></span></h2>
<script>
    let i1 = document.querySelector('.i1');
    let i2 = document.querySelector('.i2');
    let result = document.querySelector('.result');

    function calculate(operator) {
        let num1 = parseInt(i1.value);
        let num2 = parseInt(i2.value);

        switch (operator) {
            case '+':
                result.innerHTML = num1 + num2;
                break;
            case '-':
                result.innerHTML = num1 - num2;
                break;
            case '*':
                result.innerHTML = num1 * num2;
                break;
            case '/':
                if (num2 === 0) {
                    alert('除数不能为0!');
                    return;
                }
                result.innerHTML = num1 / num2;
                break;
            default:
                alert('无效的操作符');
        }
    }
</script>
</body>
</html>